<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>bootstrap table </title>
		
		<link href="../css/bootstrap.min.css" rel="stylesheet">
		<link href="../css/bootstrap-table.min.css" rel="stylesheet" >
		<script src="../js/jquery.min.js"></script>
		<script src="../js/bootstrap.min.js"></script>
		<script src="../js/bootstrap-table.min.js"></script>
		<script src="../js/bootstrap-table-zh-CN.js"></script>
		<script src="../js/swift.js"></script>
	</head>
	<body>
		<table id="mytb1">
	        <thead>
	            <tr>
	                <th data-field="Name" data-editable="true">部门名称</th>
	                <th data-field="ParentName">上级部门</th>
	                <th data-field="Level" data-editable="true">部门级别</th>
	                <th data-field="Desc" data-editable="true">描述</th>
	            </tr>
	        </thead>
    	</table>
		
		<script type="text/javascript">
		$('#mytb1').bootstrapTable({
            url: '/html/json/bt.json',         //请求后台的URL（*）
            method: 'get',                      //请求方式（*）
//             toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            //queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber: 1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            onEditableSave: function (field, row, oldValue, $el) {
                $.ajax({
                    type: "post",
                    url: "/Editable/Edit",
                    data: { strJson: JSON.stringify(row) },
                    success: function (data, status) {
                        if (status == "success") {
                            alert("编辑成功");
                        }
                    },
                    error: function () {
                        alert("Error");
                    },
                    complete: function () {

                    }

                });
            }
        });
		
		
		
		
		
		
		
		
		
		</script>
	</body>
</html>


